//员工列表
//获取列表
obtain()
let listDataS = [];

function obtain() {
  $.ajax({
    url: 'http://localhost:8089/api/shop/list',
    type: 'get',
    data: {
      pageNo: $('#min').text() || 1, //当前页号 
      pageSize: 5 //每页记录条数
    },
    success: function (data) {
      paging(data.resultInfo);
      let listData = data.resultInfo.list;
      for (let i = 0; i < listData.length; i++) {
        listDataS.push(listData[i])
      }
      let set = '';
      set = `
              <tr>
                  <th style="width: 60px;"><input type="checkbox" class="checkbox-all">全选</th>
                  <th style="width: 80px;">商品编号</th>
                  <th>商品姓名</th>
                  <th>商品图片</th>
                  <th style="width: 600px;">介绍</th>
                  <th style="width: 50px;">原价</th>
                  <th style="width: 50px;">折扣价</th>
                  <th style="width: 100px;">商店名</th>
                  <th colspan="2" style="width: 200px;">操作</th>
              </tr>
      `
      for (let i = 0; i < listData.length; i++) {
        set += `
        <tr>
            <td> <input type="checkbox" class="checkbox-item"></td>
            <td>${i+1}</td>
            <td>${listDataS[i].product}</td>
            <td><img src='${listDataS[i].picture}'></td>
            <td>${listDataS[i].detail}</td>
            <td>${listDataS[i].oldprice}</td>
            <td>${listDataS[i].price}</td>
            <td>${listDataS[i].shop}</td>
            <td><a href="#" onclick="deleteData(${i})">删除</a> </td>
            <td><a href="#" onclick="editForm(${i})">编辑</a></td>
        </tr>
        `
      }
      $('tbody').html(set)
      topForm()
    }
  })
}

// 表格头部
function topForm() {
  let foemW = '' + $('tbody').css('width');
  $('.topBtn').attr('width', foemW)
}
// 打开添加表单
function openForm() {
  fileBtn()
  $('.employeeForm h1 span').text('添加数据')
  $('.employeeForm').css('display', 'block');
  
  $('#submit').on('click', function () {

    let shopFoem = $('#shop').val(); //店铺
    let productFoem = $('#product').val(); //商品
    let priceFoem = $('#price').val(); //价格
    let oldpriceFoem = $('#oldprice').val(); //原价
    let putawayForm = $('input[name="sex"]:checked').val(); //是否上架
    let categoryIdFoem = $('select').val() // 商品分类
    let detailForm = $('#detail').val(); //介绍详情

    $.ajax({
      url: 'http://localhost:8089/api/shop/add',
      type: 'post',
      data: {
        shop: shopFoem, //店铺
        picture: imgSrc(), //图片
        product: productFoem, //商品
        price: priceFoem, //价格
        oldprice: oldpriceFoem, //原价
        putaway: putawayForm, //是否上架  1上架， 0下架
        categoryId: categoryIdFoem, // 商品分类  必填
        detail: detailForm, //介绍详情
      },
      success: function (data) {
        let result = data.resultCode
        if (result == 1) {
          alert('成功添加！')
        } else {
          alert('添加失败')
        }
      }
    })
    listDataS = []; //清空数据
    obtain()
    closeForm()
  })

}
// 打开编辑表单
function editForm(id) {
  fileBtn()
  $('#shop').val(listDataS[id].shop); //店铺
  // $('#imgBtn').val(listDataS[id].picture)//图片按钮
  $('#img').attr('src', listDataS[id].picture)//图片
  $('#product').val(listDataS[id].product); //商品
  $('#price').val(listDataS[id].price); //价格
  $('#oldprice').val(listDataS[id].oldprice); //原价
  //是否上架
  $('select').val(listDataS[id].detail); // 商品分类
  $('#detail').val(listDataS[id].detail); //介绍详情

  $('.employeeForm h1 span').text('编辑数据')
  $('.employeeForm').css('display', 'block');
  $('#submit').click(function () {
    let titName = $('.employeeForm h1 span').text()
    alert(titName)

    listDataS = []; //清空数据
    obtain()
    closeForm()
  })

}

// 关闭表单
function closeForm() {
  $('.employeeForm').css('display', 'none');
  $('#submit').off('click')

  $('#shop').val('');
  $('#product').val('');
  $('#price').val('');
  $('#oldprice').val('');
  $('#detail').val('');
  $('#imgBtn').val('');
  $('#img').attr('src', '');

}

// 提交数据
function SubmitData(num) {
  console.log('开始', num)
}
// 图片地址拼接
function imgSrc() {
  let arr = [];
  let str = '';
  let imgFoem = $('#imgBtn').val();
  for (let i = 0; i < imgFoem.length; i++) {
    if (imgFoem.charAt(i) != '\\') {
      str = str + imgFoem.charAt(i)
    } else {
      arr.push(str)
      str = '';
    }
  }
  return str = `../../static/index/${str}`;
}
// 图片预浏览
function fileBtn() {
  $('#imgBtn').change((e) => {
    var picObj = e.target.files[0] //选中的图片对象
    var fileReader = new FileReader() //创建文件读对象
    fileReader.readAsDataURL(picObj) // 读取计算朵中选中文件
    //文件读取完成后执行
    fileReader.onload = function (picDataObj) {
      $('#img').attr('src', picDataObj.target.result)
    }
  })
}
// 删除数据
function deleteData(num) {
  let idData = listDataS[num].id;
  $.ajax({
    url: 'http://localhost:8089/api/shop/delete',
    type: 'get',
    data: {
      id: idData,
    },
    success: function (data) {
      let result = data.resultCode;
      if (result == 1) {
        alert('成功！')
        listDataS = []; //清空数据
        obtain()
      } else {
        alert('失败！')
      }
    }
  })
}
// 分页
function paging(data) {
  let currentNo = data.currentNo;
  let totalNum = data.totalNum;
  $('#min').html(currentNo)
  $('#max').html(totalNum)
}


$('#plusnum').click(function () {
  let min = $('#min').text();
  let max = $('#max').text();
  let num = parseInt(min) + 1
  if (min < max) {
    $('#min').text(num)
    listDataS = []; //清空数据
    obtain()
  } else(
    min = max
  )
})
// 减 reduce
$('#reduce').click(function () {
  let min = $('#min').text();
  let max = $('#max').text();
  let num = parseInt(min) - 1
  if (min > 1) {
    $('#min').text(num)
    listDataS = []; //清空数据
    obtain()
  } else(
    min = 1
  )
})